<template>
  <view class="page">
    <Header></Header>
    <view class="main_container">
      <view class="main_content">
        <Breadcrumb :text="'个人评测-课堂作业-句子拼写'"> </Breadcrumb>
        <view class="content">
          <SentencePractice2
            ref="sentencePractice"
            v-if="componentKey > 0"
            :key="componentKey"
            :type="type"
            :sentence="sentence"
            :bookInfo="bookChapter"
            :chapterInfo="chapterRec"
            :sentenceSort="sentenceSort"
            :sentenceNum="sentenceNum"
            :testFlag="testFlag"
            @change="sentenceChange"
            @save="handleSave"
            @view="handleView"
          ></SentencePractice2>
        </view>
      </view>
    </view>
  </view>
</template>

<script>
import {
  findSentenceByChapterId,
  classworkListeningSave,
} from "@/api/classWork";
export default {
  components: {},
  onLoad(option) {
    this.chapterId = option.chapterId;
    this.init();
  },
  data() {
    return {
      type: 2,
      chapterId: "",
      sentence: null,
      bookChapter: null,
      chapterRec: null,
      sentenceSort: 0,
      sentenceNum: 0,
      testFlag: false,
      componentKey: 0,
    };
  },
  methods: {
    init() {
      //default
      this.sentenceChange();
    },
    sentenceChange() {
      this.getSentence().then(() => {
        this.componentKey += 1;
      });
    },
    async getSentence() {
      let params = {
        chapterId: this.chapterId,
        type: this.type,
      };
      await findSentenceByChapterId(params).then((res) => {
        let sentence = res.data.sentence;
        if (sentence) {
          sentence.randomWords = sentence.randomWords.filter(
            (item) => item.trim() !== ""
          );
          sentence.sentenceWords = sentence.sentenceWords.filter(
            (item) => item.trim() !== ""
          );
        }
        this.sentence = sentence;
        this.bookChapter = res.data.bookChapter;
        this.chapterRec = res.data.chapterRec;
        this.sentenceSort = res.data.sentenceSort;
        this.sentenceNum = res.data.sentenceNum;
        this.testFlag = res.data.testFlag;
      });
    },
    handleSave(flag) {
      let params = {
        chapterId: this.chapterId,
        sentenceId: this.sentence.id,
        correctFlag: flag,
        type: this.type,
      };
      classworkListeningSave(params);
    },
    handleView() {
      uni.redirectTo({
        url: `/pages/classWork/classWorkTranslation/classWorkTranslationAfterSchool?chapterId=${this.chapterId}`,
      });
    },
  },
};
</script>

<style lang="scss" scoped>
@import "./classWorkTranslationDetail";
</style>
